C.S.Burner 🪙 ━►🔥GIT Node
Node / reticulum_mirror / MeshChatX / files / meshchatx / src / frontend / components / rnprobe / RNProbePage.vue
Displaying Raw • Download
meshchatx/src/frontend/components/rnprobe/RNProbePage.vue 9ec2a88817819d433c5d68dbec0ca070ca989b91 (9ec2a888) Text, 11.31 KB
T8b949e<!-- SPDX-License-Identifier: 0BSD -->
Tff7b72<templateTff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"flex flex-col flex-1 overflow-hidden min-w-0 bg-slate-50 dark:bg-zinc-950"Tff7b72>
Tff7b72<div
Te6edf3class=Ta5d6ff"flex-1 overflow-y-auto w-full px-4 md:px-5 lg:px-8 py-6 pb-[max(1.5rem,env(safe-area-inset-bottom))]"
Tff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"space-y-4 w-full max-w-4xl mx-auto"Tff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"glass-card space-y-5"Tff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"space-y-2"Tff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"text-xs uppercase tracking-wide text-gray-500 dark:text-gray-400"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.network_diagnostics"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"text-2xl font-semibold text-gray-900 dark:text-white"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.title"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"text-sm text-gray-600 dark:text-gray-300"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.description"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"grid lg:grid-cols-2 gap-4"Tff7b72>
Tff7b72<divTff7b72>
Tff7b72<label Te6edf3class=Ta5d6ff"glass-label"Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.destination_hash"Tff7b72) Tff7b72}}Tff7b72</label>
Tff7b72<input
Te6edf3v-model=Ta5d6ff"destinationHash"
Te6edf3type=Ta5d6ff"text"
Te6edf3placeholder=Ta5d6ff"e.g. 7b746057a7294469799cd8d7d429676a"
Te6edf3class=Ta5d6ff"input-field font-mono"
Tff7b72/>
Tff7b72</div>
Tff7b72<divTff7b72>
Tff7b72<label Te6edf3class=Ta5d6ff"glass-label"Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.full_destination_name"Tff7b72) Tff7b72}}Tff7b72</label>
Tff7b72<input
Te6edf3v-model=Ta5d6ff"fullName"
Te6edf3type=Ta5d6ff"text"
Te6edf3placeholder=Ta5d6ff"e.g. lxmf.delivery"
Te6edf3class=Ta5d6ff"input-field"
Tff7b72/>
Tff7b72</div>
Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"grid lg:grid-cols-3 gap-4"Tff7b72>
Tff7b72<divTff7b72>
Tff7b72<label Te6edf3class=Ta5d6ff"glass-label"Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.probe_size_bytes"Tff7b72) Tff7b72}}Tff7b72</label>
Tff7b72<input Te6edf3v-model=Ta5d6ff"probeSize" Te6edf3type=Ta5d6ff"number" Te6edf3min=Ta5d6ff"1" Te6edf3max=Ta5d6ff"1024" Te6edf3class=Ta5d6ff"input-field" Tff7b72/>
Tff7b72</div>
Tff7b72<divTff7b72>
Tff7b72<label Te6edf3class=Ta5d6ff"glass-label"Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.number_of_probes"Tff7b72) Tff7b72}}Tff7b72</label>
Tff7b72<input Te6edf3v-model=Ta5d6ff"probes" Te6edf3type=Ta5d6ff"number" Te6edf3min=Ta5d6ff"1" Te6edf3max=Ta5d6ff"100" Te6edf3class=Ta5d6ff"input-field" Tff7b72/>
Tff7b72</div>
Tff7b72<divTff7b72>
Tff7b72<label Te6edf3class=Ta5d6ff"glass-label"Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.wait_between_probes"Tff7b72) Tff7b72}}Tff7b72</label>
Tff7b72<input Te6edf3v-model=Ta5d6ff"wait" Te6edf3type=Ta5d6ff"number" Te6edf3min=Ta5d6ff"0" Te6edf3step=Ta5d6ff"0.1" Te6edf3class=Ta5d6ff"input-field" Tff7b72/>
Tff7b72</div>
Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"flex gap-2"Tff7b72>
Tff7b72<button
Te6edf3v-if=Ta5d6ff"!isRunning"
Te6edf3type=Ta5d6ff"button"
Te6edf3class=Ta5d6ff"primary-chip px-4 py-2 text-sm"
@Te6edf3click=Ta5d6ff"startProbe"
Tff7b72>
Tff7b72<MaterialDesignIcon Te6edf3icon-name=Ta5d6ff"radar" Te6edf3class=Ta5d6ff"w-4 h-4" Tff7b72/>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.start_probe"Tff7b72) Tff7b72}}
Tff7b72</button>
Tff7b72<button
v-else
Te6edf3type=Ta5d6ff"button"
Te6edf3class=Ta5d6ff"secondary-chip px-4 py-2 text-sm text-red-600 dark:text-red-300 border-red-200 dark:border-red-500/50"
@Te6edf3click=Ta5d6ff"stopProbe"
Tff7b72>
Tff7b72<MaterialDesignIcon Te6edf3icon-name=Ta5d6ff"stop" Te6edf3class=Ta5d6ff"w-4 h-4" Tff7b72/>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.stop"Tff7b72) Tff7b72}}
Tff7b72</button>
Tff7b72<button Te6edf3type=Ta5d6ff"button" Te6edf3class=Ta5d6ff"secondary-chip px-4 py-2 text-sm" @Te6edf3click=Ta5d6ff"clearResults"Tff7b72>
Tff7b72<MaterialDesignIcon Te6edf3icon-name=Ta5d6ff"broom" Te6edf3class=Ta5d6ff"w-4 h-4" Tff7b72/>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.clear_results"Tff7b72) Tff7b72}}
Tff7b72</button>
Tff7b72</div>
Tff7b72<div
Te6edf3v-if=Ta5d6ff"summary"
Te6edf3class=Ta5d6ff"p-3 rounded-lg bg-blue-50 dark:bg-blue-900/20 text-blue-700 dark:text-blue-300"
Tff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"font-semibold"Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.summary"Tff7b72) Tff7b72}}:Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"text-sm mt-1"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.sent"Tff7b72) Tff7b72}}: Tff7b72{{ Te6edf3summaryTe6edf3.sent Tff7b72}}, Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.delivered"Tff7b72) Tff7b72}}:
Tff7b72{{ Te6edf3summaryTe6edf3.delivered Tff7b72}}, Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.timeouts"Tff7b72) Tff7b72}}: Tff7b72{{ Te6edf3summaryTe6edf3.timeouts Tff7b72}},
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.failed"Tff7b72) Tff7b72}}:
Tff7b72{{ Te6edf3summaryTe6edf3.failed Tff7b72}}
Tff7b72</div>
Tff7b72</div>
Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"glass-card flex flex-col min-h-[320px] space-y-3"Tff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"flex items-center justify-between gap-4"Tff7b72>
Tff7b72<divTff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"text-sm font-semibold text-gray-900 dark:text-white"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.probe_results"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72<div Te6edf3class=Ta5d6ff"text-xs text-gray-500 dark:text-gray-400"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.probe_responses_realtime"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72</div>
Tff7b72</div>
Tff7b72<div
Te6edf3class=Ta5d6ff"flex-1 overflow-y-auto rounded-2xl bg-black/80 text-emerald-300 font-mono text-xs p-3 space-y-2 shadow-inner border border-zinc-900"
Tff7b72>
Tff7b72<div Te6edf3v-if=Ta5d6ff"results.length === 0" Te6edf3class=Ta5d6ff"text-emerald-500/80"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.no_probes_yet"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72<div Te6edf3v-for=Ta5d6ff"(result, index) in results" Te6edf3:key=Ta5d6ff"index" Te6edf3class=Ta5d6ff"space-y-1"Tff7b72>
Tff7b72<div Te6edf3class=Ta5d6ff"flex items-center gap-2"Tff7b72>
Tff7b72<span Te6edf3class=Ta5d6ff"text-emerald-400"Tff7b72>Tff7b72{{
$Te6edf3tTff7b72(Ta5d6ff"rnprobe.probe_number"Tff7b72, Tff7b72{ Te6edf3numberTff7b72: Te6edf3resultTe6edf3.probe_number Tff7b72}Tff7b72)
Tff7b72}}Tff7b72</span>
Tff7b72<span Te6edf3class=Ta5d6ff"text-gray-400"Tff7b72>(Tff7b72{{ Te6edf3resultTe6edf3.size Tff7b72}} Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.bytes"Tff7b72) Tff7b72}})Tff7b72</span>
Tff7b72<span Te6edf3class=Ta5d6ff"text-gray-400"Tff7b72>→Tff7b72</span>
Tff7b72<span Te6edf3class=Ta5d6ff"text-emerald-300"Tff7b72>Tff7b72{{ Te6edf3resultTe6edf3.destination Tff7b72}}Tff7b72</span>
Tff7b72</div>
Tff7b72<div Te6edf3v-if=Ta5d6ff"result.via || result.interface" Te6edf3class=Ta5d6ff"text-gray-500 ml-4"Tff7b72>
Tff7b72{{ Te6edf3resultTe6edf3.via Tff7b72}}Tff7b72{{ Te6edf3resultTe6edf3.interface Tff7b72}}
Tff7b72</div>
Tff7b72<div Te6edf3v-if=Ta5d6ff"result.status === 'delivered'" Te6edf3class=Ta5d6ff"text-green-400 ml-4 space-y-1"Tff7b72>
Tff7b72<divTff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.summary"Tff7b72) Tff7b72}}: Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.delivered"Tff7b72) Tff7b72}}Tff7b72</div>
Tff7b72<divTff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.hops"Tff7b72) Tff7b72}}: Tff7b72{{ Te6edf3resultTe6edf3.hops Tff7b72}}Tff7b72</div>
Tff7b72<divTff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.rtt"Tff7b72) Tff7b72}}: Tff7b72{{ Te6edf3resultTe6edf3.rtt_string Tff7b72}}Tff7b72</div>
Tff7b72<div Te6edf3v-if=Ta5d6ff"result.reception_stats" Te6edf3class=Ta5d6ff"space-x-2"Tff7b72>
Tff7b72<span Te6edf3v-if=Ta5d6ff"result.reception_stats.rssi"
Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.rssi"Tff7b72) Tff7b72}}: Tff7b72{{ Te6edf3resultTe6edf3.reception_statsTe6edf3.rssi Tff7b72}} dBmTff7b72</span
>
Tff7b72<span Te6edf3v-if=Ta5d6ff"result.reception_stats.snr"
Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.snr"Tff7b72) Tff7b72}}: Tff7b72{{ Te6edf3resultTe6edf3.reception_statsTe6edf3.snr Tff7b72}} dBTff7b72</span
>
Tff7b72<span Te6edf3v-if=Ta5d6ff"result.reception_stats.quality"
Tff7b72>Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.quality"Tff7b72) Tff7b72}}: Tff7b72{{ Te6edf3resultTe6edf3.reception_statsTe6edf3.quality Tff7b72}}%Tff7b72</span
>
Tff7b72</div>
Tff7b72</div>
Tff7b72<div Te6edf3v-else-if=Ta5d6ff"result.status === 'timeout'" Te6edf3class=Ta5d6ff"text-yellow-400 ml-4"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.summary"Tff7b72) Tff7b72}}: Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.timeout"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72<div v-else Te6edf3class=Ta5d6ff"text-red-400 ml-4"Tff7b72>
Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.summary"Tff7b72) Tff7b72}}: Tff7b72{{ $Te6edf3tTff7b72(Ta5d6ff"rnprobe.failed"Tff7b72) Tff7b72}}
Tff7b72</div>
Tff7b72</div>
Tff7b72</div>
Tff7b72</div>
Tff7b72</div>
Tff7b72</div>
Tff7b72</div>
Tff7b72</template>
Tff7b72<scriptTff7b72>
import DialogUtils from "../../js/DialogUtils";
import MaterialDesignIcon from "../MaterialDesignIcon.vue";
export default {
name: "RNProbePage",
components: {
MaterialDesignIcon,
},
data() {
return {
isRunning: false,
destinationHash: null,
fullName: "lxmf.delivery",
probeSize: 16,
probes: 1,
wait: 0,
results: [],
summary: null,
abortController: null,
};
},
beforeUnmount() {
this.stopProbe();
},
methods: {
async startProbe() {
if (this.isRunning) {
return;
}
if (!this.destinationHash || this.destinationHash.length !== 32) {
DialogUtils.alert(this.$t("rnprobe.invalid_hash"));
return;
}
if (!this.fullName) {
DialogUtils.alert(this.$t("rnprobe.provide_full_name"));
return;
}
this.isRunning = true;
this.abortController = new AbortController();
this.results = [];
this.summary = null;
try {
const response = await window.api.post(
"/api/v1/rnprobe",
{
destination_hash: this.destinationHash,
full_name: this.fullName,
size: this.probeSize,
probes: this.probes,
wait: this.wait,
},
{
signal: this.abortController.signal,
}
);
this.results = response.data.results || [];
this.summary = {
sent: response.data.sent || 0,
delivered: response.data.delivered || 0,
timeouts: response.data.timeouts || 0,
failed: response.data.failed || 0,
};
} catch (e) {
if (!window.api.isCancel(e)) {
console.error(e);
DialogUtils.alert(e.response?.data?.message || this.$t("rnprobe.failed_to_probe"));
}
} finally {
this.isRunning = false;
}
},
stopProbe() {
this.isRunning = false;
if (this.abortController) {
this.abortController.abort();
}
},
clearResults() {
this.results = [];
this.summary = null;
},
},
};
Tff7b72</script>
Served by rngit 1.5.2 - Generated in 0.03s